* {
	margin: 0;
	padding: 0;
}
body{
	position: relative;
	z-index: 100;
}
.navicons {
	width: 100%;
	height: 16vw;
	background-color: #ffffff;
	box-shadow: 0 0.3vw 2.9vw 0 rgba(224, 223, 223, 0.5);
	display: flex;
	padding-top: 1vw;
	position: fixed;
	bottom: -2vw;
	z-index: 10;
}

.navicons .nav .font {
	font-family: PingFangSC-Regular;
	font-size: 1.5vw;
	color: #999999;
}

.navicons .nav .icon {
	width: 7vw;
	height: 6.8vw;
	margin-bottom: 1vw;
}

.navicons .nav .add {
	width: 14vw;
	height: 14vw;
	position: absolute;
	top: 1vw;
}

.navicons .nav {
	width: 20%;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.navicons .addfun {
	width: 20%;
	display: flex;
	flex-direction: column;
	align-items: center;
	position: absolute;
	top: -9vw;
	left: 40%;
}

.navicons .addfun .add {
	width: 19vw;
	height: 19vw;
}

.navicons .addfun .font {
	font-family: PingFangSC-Regular;
	font-size: 1.5vw;
	color: #999999;
	position: absolute;
	top: 18vw;
}

.redround {
	width: 2vw;
	height: 2vw;
	background-color: #f43531;
	border-radius: 50%;
	position: absolute;
	right: 7vw;
}

.bgblack {
	height: 100vh;
    background: rgba(0,0,0,0.5);
    position: absolute;
    top: 0;
    width: 100%;
}

.sendbgcon {

	font-family: PingFangSC-Light;
	font-size: 3.2vw;
	color: #ffffff;
	padding: 0.5vw 2vw;
	padding-bottom: 1vw;
}

.sendbg1 {
	background: url(../../images/navsend/bg-a@3x.png);
	background-size: 100% 100%;
}

.sendbg2 {
	background: url(../../images/navsend/red.png);
	background-size: 100% 100%;
}

.sendbg3 {
	background: url(../../images/navsend/bg-c@3x.png);
	background-size: 100% 100%;
}

.sendbg4 {
	background: url(../../images/navsend/bg-d@3x.png);
	background-size: 100% 100%;
}

.bgblack .icons .icon {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.bgblack .icons .icon .sendicon {
	width: 15vw;
	height: 15vw;
	margin-bottom: 3vw;
}

.icons {
	display: flex;
	position: absolute;
	bottom: 31vw;
	justify-content: space-between;
	width: 88%;
	margin: 0 6vw;
}
